{template 'web/'.$cfg['floder'].'/base_menu'}
<script src="{MODULE_URL}template/resources/js/jquery-ui.min.js"></script>
<div class="top_tab">
    <a href="{php echo $this->createWebUrl('goods',array('op'=>'display'))}" class="layui-btn layui-btn-primary">商品管理</a>
    <a href="{php echo $this->createWebUrl('goods',array('op'=>'categorydisplay'))}" class="layui-btn layui-btn-primary">分类管理</a>
    <a href="{php echo $this->createWebUrl('goodspackage')}" class="layui-btn">套餐管理</a>
    <a href="{php echo $this->createWebUrl('goods',array('op'=>'printdisplay'))}" class="layui-btn layui-btn-primary">打印分类</a>
</div>
<style>
    .panelbox-head i{ color:#009688;}
    .panelbox-head a{ margin-right:10px}
</style>

{if $operation == 'display'}
<div class="panelbox">
    <form action="" method="post" class="layui-form" id="listform" enctype="multipart/form-data">
        <div class="panelbox-head form-inline">
            <A href="{php echo $this->createWebUrl('goodspackage',array('op'=>'post'))}"><i class="fa fa-plus"></i> 新增</A>
            <div class="pull-right form-inline">
                <select id="statuslist" style="display:inline-block;" lay-ignore onchange="jumptoNew()">
                    <option value="0">全部商品</option>
                    <option value="2" {if $_GPC['status1']==2}selected{/if}>上架商品</option>
                    <option value="1" {if $_GPC['status1']==1}selected{/if}>下架商品</option>
                </select>
            </div>
        </div>
        <div class="panelbox-body">
            <div class="layui-form">
                <table class="layui-table">
                    <thead>
                    <tr>
                        <th style="width:60px"><input type="checkbox" name="" lay-skin="primary" lay-filter="allChoose"></th>
                        <th>名称</th>
                        <th>零售价</th>
                        <th>会员价</th>
                        <th>状态</th>
                        <th>操作</th>
                    </tr>
                    </thead>
                    <tbody>
                    {loop $list $row}
                    <tr rid="{$row['id']}">
                        <td><input type="hidden" name="displayorder" value="{$row['id']}" />
                            <span class="order">{$row['displayorder']}</span></td>
                        <td>{$row['title']}</td>
                        <td>{$row['price']}</td>
                        <td>{$row['memberprice']}</td>
                        <td>{if $row['status']}<span class="label label-info">显示</span>{else}<span class="label label-default">不显示</span>{/if}</td>
                        <td class="text-right">
                            <a href="{php echo $this->createWebUrl('goodspackage',array('op'=>'post','id'=>$row['id']))}" class="layui-btn layui-btn-normal layui-btn-small"><i class="layui-icon">&#xe642;</i></a> <a href="javascript:deleteContent('{php echo $this->createWebUrl('goodspackage',array('op'=>'delete','id'=>$row['id']))}')" class="layui-btn layui-btn-danger layui-btn-small"><i class="layui-icon">&#xe640;</i></a></td>
                    </tr>
                    {/loop}
                    </tbody>
                </table>
            </div>
        </div>
    </form>
</div>


<script language="javascript">
    var fixHelper = function(e, ui) {
        ui.children().each(function() {
            $(this).width($(this).width());
        });
        return ui;
    };
    $(".layui-table tbody").sortable({
        helper: fixHelper,
        axis:"y",
        start:function(e, ui){
            ui.helper.css({"background":"#F60"});
        },
        stop:function(e, ui){
            ui.item.css({"background":"#FFF"});
            updateMove(e, ui);
        },
    }).disableSelection();

    function updateMove(){
        var temp={};
        $("input[name='displayorder']").each(function(index, element) {
            var val=$(this).val();
            temp[val]=index+1;
        });
        var index2=layer.load(1, {shade: [0.1,'#fff']});
        $.post("{php echo $this->createWebUrl('goodspackage',array('op'=>'changecateorder'))}",{displayorder:temp},function(returnstr){
            layer.close(index2);
            console.log(returnstr);
            var result=eval("("+returnstr+")");
            if(result.success){
                layer.msg("更新排序成功",{icon:1,time:2000});
                $(".order").each(function(index, element) {
                    $(this).text(index+1);
                });
            }else{
                layer.msg(result.msg ? result.msg : returnstr,{icon:2,time:2000});
            }
        });
    }
    function jumptoNew(){
        var pcate=$("#pcatelist option:selected").val();
        var status=$("#statuslist option:selected").val();
        var shorttitle=$("#shorttitle option:selected").val();
        location.href="{php echo $this->createWebUrl('goodspackage',array('op'=>'display'))}&pcate="+pcate+"&status1="+status;
    }

</script>
{elseif $operation == 'post'}
<style>
    #btnList label{margin-bottom:10px; display:block;}
</style>
<div class="panelbox">
    <form action="" method="post" onsubmit="return startsubmit();" class="layui-form" enctype="multipart/form-data">
        <input type="hidden" name="id" value="{php echo $id}" />
        <div class="panelbox-head"> {if !$id}添加{else}编辑{/if} </div>
        <div class="panelbox-body">
            <div class="layui-form-item">
                <label class="layui-form-label">套餐标题</label>
                <div class="layui-input-block">
                    <input type="text" class="layui-input" lay-verify="required" name="title" value="{$item['title']}"/>
                    <div class="help-block">套餐标题</div>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">状态</label>
                <div class="layui-input-block">
                    <input type="radio" name="status" value="0" title="下架" {if $item['status']==0}checked{/if}/>
                    <input type="radio" name="status" value="1" title="上架" {if $item['status'] || !$id}checked{/if}/>
                    <div class="help-block">是否显示</div>
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">图片</label>
                <div class="layui-input-block">
                    {php echo tpl_form_field_image('thumb', $item['thumb']);}
                    <div class="help-block"></div>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">套餐原价</label>
                <div class="layui-input-block">
                    <input type="text" class="layui-input" readonly id="nprice" />
                    <div class="help-block"></div>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">销售价格</label>
                <div class="layui-input-block">
                    <input type="text" class="layui-input" lay-verify="required" name="price" value="{$item['price']}"/>
                    <div class="help-block">实际销售价格</div>
                </div>
            </div>
            <!--<div class="layui-form-item">-->
                <!--<label class="layui-form-label">会员价格</label>-->
                <!--<div class="layui-input-block">-->
                    <!--<input type="text" class="layui-input" name="memberprice" value="{$item['memberprice']}"/>-->
                    <!--<div class="help-block">会员价格(轻餐饮)</div>-->
                <!--</div>-->
            <!--</div>-->
            <div class="layui-form-item">
                <label class="layui-form-label">包含商品</label>
                <div class="layui-input-block">
                    <table class="layui-table">
                        <thead>
                        <tr>
                            <th>图片</th>
                            <th>标题</th>
                            <th>原售价</th>
                            <th>原会员价</th>
                            <th>套餐价</th>
                            <th style="text-align: right">操作</th>
                        </tr>
                        </thead>
                        <tbody id="goodbox">
                        {loop $gids $index $row}
                        <tr gid="{$row}">
                            <td><img src="{php echo tomedia($goodary[$row]['thumb'])}" width="80" height="80"/></td>
                            <td>{php echo $goodary[$row]['title']}</td>
                            <td class="oldprice">{php echo $goodary[$row]['marketprice']}</td>
                            <td>{php echo $goodary[$row]['memberprice']}</td>
                            <td><input class="newprice form-control" onchange="countprice()" value="{php echo $goodoldary[$index]}" /></td>
                            <td style="text-align:right"><a href="javascript:" onclick="deleterow(this)" class="layui-btn layui-btn-danger layui-btn-small"><i class="layui-icon">&#xe640;</i></a></td>
                        </tr>
                        {/loop}
                        </tbody>
                        <Tr>
                            <Td colspan="6"><button class="layui-btn layui-btn-danger layui-btn-small" type="button" onclick="addgood()">增加商品</button></Td>
                        </Tr>
                    </table>
                </div>
            </div>
        </div>
        <div class="panelbox-foot">
            <input type="hidden" name="goods" value="" />
            <input type="hidden" name="token" value="{$_W['token']}" />
            <input class="layui-btn" type="submit" lay-submit="" name="submit" lay-filter="btnsmbmit" value="提交">
        </div>
    </form>
</div>
<style>
    .goodpcate::-webkit-scrollbar-track {  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);  background-color: #F5F5F5;  }
    .goodpcate::-webkit-scrollbar {  width: 6px;  background-color: #F5F5F5;  }
    .goodpcate::-webkit-scrollbar-thumb {  background-color: #666;  }
ul.goodpcate ,ul.goodpcate li{margin: 0;list-style: none;}
ul.goodpcate{height: 500px; overflow-y: scroll;}
ul.goodpcate li{margin: 0;list-style: none;padding: 10px;border-bottom: 1px solid #CCC;color: #333;cursor: pointer;}
ul.goodpcate li.isselect{background: #00A6AD;color: #FFF; text-align: center}
    .goodlistbox::-webkit-scrollbar-track {  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);  background-color: #F5F5F5;  }
    .goodlistbox::-webkit-scrollbar {  width: 6px;  background-color: #F5F5F5;  }
    .goodlistbox::-webkit-scrollbar-thumb {  background-color: #666;  }
    ul.goodlistbox ,ul.goodlistbox li{margin: 0;list-style: none;}
    ul.goodlistbox{height: 500px; overflow-y: scroll;}
    ul.goodlistbox li{display: inline-block;margin: 5px;border: 1px solid #CCC;padding-bottom: 5px;text-align: center;cursor: pointer}
    ul.goodlistbox li div{width: 120px;  height:120px; margin-bottom: 5px;}
    ul.goodlistbox li div img{width: 100%;height: 100%;}
</style>
<div id="editcatebox" style="display:none">
    <form id="editcateform" class="layui-form" onsubmit="return false;">
        <div style="padding: 10px;">
            <div class="input-group">
                <span class="input-group-addon">关键字</span>
                <input type="text" class="form-control" id="keyword" placeholder="输入标题/条码">
                <span class="input-group-btn"><button class="btn btn-default"  type="button" onclick="searchgood()">搜索</button></span>
            </div>
        </div>
        <div class="layui-row">
            <div class="layui-col-xs2 layui-col-sm2 layui-col-md2" id="editboxl" style="border-right: 1px solid #CCC;">
                <ul class="goodpcate">
                    {loop $goodpcate $row}
                    <li cid="{$row['id']}" onclick="selectgoodpcate({$row['id']})">{$row['title']}</li>
                    {/loop}
                </ul>
            </div>
            <div class="layui-col-xs10 layui-col-sm10 layui-col-md10">
                <ul class="goodlistbox">

                </ul>
            </div>
        </div>
    </form>
</div>
<script>
    countprice();
    function deleterow(obj){
        $(obj).parent().parent().remove();
        countprice();
    }
    function searchgood(){
        var keyword=$("#keyword").val();
        if(keyword.length==0){
            layer.msg("请输入关键字",{icon:2,time:1500});
            return;
        }
        $(".goodlistbox").empty();
        $(".goodpcate li").removeClass("isselect");
        index2=layer.load(1);
        $.post("{php echo $this->createWebUrl('goodspackage',array('op'=>'getgoods'))}",{keyword:keyword},function(data){
            layer.close(index2);
            if(data.success){
                var list=data.list;
                var temp="";
                for(var i in list){
                    temp='<li gid="'+list[i].id+'" onclick="selectgood('+list[i].id+')"><div><img src="'+list[i].thumb+'" onerror="this.src=\'{MODULE_URL}template/resources/img/002.png\'"/></div>'+list[i].title+'</li>';
                    $(".goodlistbox").append(temp);
                }
            }else{
                layer.msg(data.msg,{icon:2,time:2000});
                return;
            }
        },'json');
    }
    function addgood(){
        layer.open({
            type: 1,
            title:"选择商品",
            area:"700px",
            btn: ['关闭'],
            btn1:function(index,layero){
                layer.close(index);
            },
            content: $("#editcatebox").show(),
            success:function(){
                $("#keyword").val("");
                $(".goodpcate li").eq(0).click();
            },
            end:function(){
                $("#editcatebox").hide();
            }
        });
    }
    function selectgoodpcate(id){
        $(".goodlistbox").empty();
        $(".goodpcate li[cid='"+id+"']").addClass("isselect").siblings().removeClass("isselect");
        index2=layer.load(1);
        $.post("{php echo $this->createWebUrl('goodspackage',array('op'=>'getgoods'))}",{cid:id},function(data){
            layer.close(index2);
            if(data.success){
                var list=data.list;
                var temp="";
                for(var i in list){
                    temp='<li gid="'+list[i].id+'" onclick="selectgood('+list[i].id+')"><div><img src="'+list[i].thumb+'" onerror="this.src=\'{MODULE_URL}template/resources/img/002.png\'"/></div>'+list[i].title+'</li>';
                    $(".goodlistbox").append(temp);
                }
            }else{
                layer.msg(data.msg,{icon:2,time:2000});
                return;
            }
        },'json');
    }
    function selectgood(id){
        index2=layer.load(1, {shade: [0.5,'#fff']});
        $.post("{php echo $this->createWebUrl('goodspackage',array('op'=>'getonegood'))}",{id:id},function(data){
            console.log(data);
            var result=eval("("+data+")");
            if(result.success){
                layer.closeAll();
                var item=result.item;
                var temp='<tr gid="'+item.id+'"><td><img src="'+item.thumb+'" width="80" height="80" onerror="this.src=\'{MODULE_URL}template/resources/img/002.png\'"/></td><td>'+item.title+'</td><td class="oldprice">'+item.marketprice+'</td><td >'+item.memberprice+'</td><td><input class="newprice form-control" onchange="countprice()" value="'+item.marketprice+'" /></td><td style="text-align: right"><a href="javascript:" onclick="deleterow(this)" class="layui-btn layui-btn-danger layui-btn-small"><i class="layui-icon">&#xe640;</i></a></td></tr>';
                $("#goodbox").append(temp);
                countprice();
            }else{
                layer.msg(result.msg,{icon:2,time:2000},function(){layer.closeAll();});
                return;
            }
        });
    }
    function countprice(){
        var oldprice=0;
        var newprice=0;
        $("#goodbox .oldprice").each(function(index){
            var temp=parseInt(parseFloat($(this).text())*100);
            oldprice+=temp;
        });
        $("#goodbox .newprice").each(function(index){
            var temp=parseInt(parseFloat($(this).val())*100);
            newprice+=temp;
        });
        $("#nprice").val((oldprice*0.01).toFixed(2));
        $("input[name='price']").val((newprice*0.01).toFixed(2));
    }
    function startsubmit(){
        var newprice=parseInt(parseFloat($("input[name='price']").val())*100);
        var oldprice=parseInt(parseFloat($("#nprice").val())*100);
//        if(newprice>oldprice){
//            layer.msg("套餐价格不能大于组合原价",{icon:2,time:1500});
//            return false;
//        }
        if($("#goodbox tr").size()==0){
            layer.msg(result.msg,{icon:2,time:1500});
            return false;
        }
        var temp=[];
        $("#goodbox tr").each(function(index){
            console.log($(this).attr("gid"));
            var key=$(this).attr("gid");
            var val=$(this).find(".newprice").val();
            temp.push(key+":"+val);
        });
        $("input[name='goods']").val(temp.join(","));
        return true;
    }
</script>
{/if}

<script>

    layui.use(['layer', 'laypage', 'element','form'], function(){
        var layer = layui.layer
                ,laypage = layui.laypage
                ,element = layui.element
                ,form = layui.form;
        form.render();
    });
    function deleteContent(url){
        layer.confirm('确认删除此内容？删除后将不可恢复', {}, function(){
            location.href=url;
        });
    }
</script>